<template>
    <el-dialog :center="false" :close-on-click-modal="false" :close-on-press-escape="false" :lock-scroll="true"
               title="数据库&静态化"
               :before-close="closeWebSocket"
               top="20px" v-model="dialogDbVisible" width="50%">
        <el-tabs>
            <el-tab-pane label="备份/还原数据库">
                <el-row>
                    <el-col :span="12">
                        <el-form-item label="数据类型">
                            <el-select placeholder="请选择数据类型" clearable v-model="dbForm.type">
                                <el-option
                                        :key="sitem.value"
                                        :label="sitem.name"
                                        :value="sitem.value"
                                        v-for="sitem in dbTypes"
                                >
                                </el-option>
                            </el-select>
                        </el-form-item>
                    </el-col>
                    <el-col :span="6">
                        <el-button @click="backup" size="middle" type="primary">数据备份</el-button>
                    </el-col>
                    <el-col :span="6">
                        <el-button @click="restore(1)" size="middle" type="warning">数据还原</el-button>
                    </el-col>
                </el-row>
                <el-row>
                    <el-table
                            :data="dbFileList"
                            :row-key="getDbIdentity"
                            @selection-change="dbSelectionChange"
                            border
                            fit="true"
                            highlight-current-row="true"
                            id="systemconfigDbPo"
                            ref="multipleTable"
                            stripe="true"
                            style="width: 100%;height:61%">
                        <el-table-column fixed width="1"/>
                        <el-table-column
                                :reserve-selection="true"
                                align="center"
                                width="50"
                        >
                            <template #default="scope">
                                <el-radio :label="scope.$index+1" v-model="idAttachment"
                                          @change.native="dbSelectionChange(scope.row)"></el-radio>
                            </template>
                        </el-table-column>
                        <el-table-column :formatter="dataFormat"
                                         :show-overflow-tooltip="true"
                                         label="文件名称"
                                         prop="fileName"/>
                        <el-table-column :formatter="dataFormat"
                                         :show-overflow-tooltip="true"
                                         label="备份时间"
                                         prop="createdDate"/>

                    </el-table>
                </el-row>
            </el-tab-pane>
            <el-tab-pane label="网站静态化">
                <el-button @click="htmlOper(1)" v-if="ruleForm.indexHtml==1" size="small" type="primary">首页静态化
                </el-button>
                <el-button @click="htmlOper(2)" v-if="ruleForm.allHtml==1" size="small" type="primary">全站静态化</el-button>
            </el-tab-pane>
        </el-tabs>

    </el-dialog>
    <el-dialog :center="false" :close-on-click-modal="false" :close-on-press-escape="false" :lock-scroll="true"
               :title="dialogTitle"
               top="20px" v-model="dialogTableVisible" width="80%">

        <el-form :model="ruleForm" :rules="rules" class="demo-ruleForm" ref="ruleForm">
            <el-form-item label="系统配置主键" prop="idSystemconfig" v-if="false">
                <el-input clearable placeholder="请输入系统配置主键"
                          v-model="ruleForm.idSystemconfig"></el-input>
            </el-form-item>

            <el-form-item label="系统名称" prop="systemName" required v-if="!false">
                <el-input clearable placeholder="请输入系统名称"
                          v-model="ruleForm.systemName"></el-input>
            </el-form-item>
            <el-form-item label="系统关键字" prop="keywords" required v-if="!false">
                <el-input clearable placeholder="请输入系统关键字" type="textarea"
                          v-model="ruleForm.keywords"></el-input>
            </el-form-item>
            <el-form-item label="系统描述" prop="description" required v-if="!false">
                <el-input clearable placeholder="请输入系统描述" type="textarea"
                          v-model="ruleForm.description"></el-input>

            </el-form-item>
            <el-row>
                <el-col :span="12">
                    <el-form-item label="网站Logo" prop="logo">

                        <el-upload :action="webchatAction('logo')"
                                   accept="image/gif, image/jpeg,image/png"
                                   :on-change="upload"
                                   :on-error="uploadError"
                                   :limit="1"
                                   name="logo"
                                   :on-progress="uploadProcess"
                                   :on-success="uploadSuccess"
                                   :on-remove="removeFile"
                                   ref="logoUpload"
                                   :file-list="ruleForm.logoList"
                                   list-type="picture-card" :auto-upload="true">

                        </el-upload>
                    </el-form-item>

                </el-col>
                <el-col :span="12">
                    <el-form-item label="企业微信二维码" prop="webchat">
                        <el-upload :action="webchatAction('webchat')"
                                   accept="image/gif, image/jpeg,image/png"
                                   :on-change="upload"
                                   :on-error="uploadError"
                                   :limit="1"
                                   name="webchat"
                                   :on-progress="uploadProcess"
                                   :on-success="uploadSuccess"
                                   :on-remove="removeFile"
                                   ref="webChatUpload"
                                   :file-list="ruleForm.webchatList"
                                   list-type="picture-card" :auto-upload="true">

                        </el-upload>
                    </el-form-item>
                </el-col>
            </el-row>
            <el-row>
                <el-col :span="8">
                    <el-form-item label="是否开启产品评论" prop="isProductFeedback"
                                  required v-if="!false">
                        <el-switch v-model="ruleForm.isProductFeedback" active-text="是" inactive-text="否"
                                   active-value="1"
                                   inactive-value="0"></el-switch>
                    </el-form-item>
                </el-col>
                <el-col :span="8">

                    <el-form-item label="是否开启新闻页面评论" prop="isNewsFeedback"
                                  required v-if="!false">
                        <el-switch v-model="ruleForm.isNewsFeedback" active-text="是" inactive-text="否" active-value="1"
                                   inactive-value="0"></el-switch>
                    </el-form-item>
                </el-col>
                <el-col :span="8">
                    <el-form-item label="是否开启单页面评论" prop="isSingleFeedback"
                                  required v-if="!false">
                        <el-switch v-model="ruleForm.isSingleFeedback" active-text="是" inactive-text="否"
                                   active-value="1"
                                   inactive-value="0"></el-switch>
                    </el-form-item>
                </el-col>
            </el-row>
            <el-row>
                <el-col :span="8">
                    <el-form-item label="默认显示" prop="isDefaultShow"
                                  required v-if="!false">
                        <el-switch v-model="ruleForm.isDefaultShow" active-text="是" inactive-text="否" active-value="1"
                                   inactive-value="0"></el-switch>
                    </el-form-item>
                </el-col>
                <el-col :span="8">
                    <el-form-item label="首页静态化" prop="indexHtml"
                                  required v-if="!false">
                        <el-switch v-model="ruleForm.indexHtml" active-text="是" inactive-text="否" active-value="1"
                                   inactive-value="0"></el-switch>
                    </el-form-item>
                </el-col>
                <el-col :span="8">
                    <el-form-item label="全网静态化" prop="allHtml"
                                  required v-if="!false">
                        <el-switch v-model="ruleForm.allHtml" active-text="是" inactive-text="否" active-value="1"
                                   inactive-value="0"></el-switch>
                    </el-form-item>
                </el-col>
            </el-row>
            <el-row>
                <el-col :span="12">
                    <el-form-item label="缩略图片地址" prop="imageShortcut"
                                  required v-if="!false">
                        <el-input clearable placeholder="请输入缩略图片地址"
                                  v-model="ruleForm.imageShortcut"></el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="缩略图片大小(px)" prop="imageShortcut"
                                  required v-if="!false">
                        <el-input-number clearable placeholder="请输入缩略图片宽度" :min="1"
                                         v-model="ruleForm.shortcutWidth"></el-input-number> &#215;
                        <el-input-number clearable placeholder="请输入缩略图片高度" :min="1"
                                         v-model="ruleForm.shortcutHeight"></el-input-number>
                    </el-form-item>
                </el-col>
            </el-row>
            <el-row>
                <el-col :span="12">
                    <el-form-item label="图片地址" prop="imageAddr"
                                  required v-if="!false">
                        <el-input clearable placeholder="请输入图片地址"
                                  v-model="ruleForm.imageAddr"></el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="图片大小(px)" prop="imageShortcut"
                                  required v-if="!false">
                        <el-input-number clearable placeholder="请输入缩略图片宽度" :min="1" model-value="500"
                                         v-model="ruleForm.imageWidth"></el-input-number>&#215;
                        <el-input-number clearable placeholder="请输入缩略图片高度" :min="1"
                                         v-model="ruleForm.imageHeight"></el-input-number>
                    </el-form-item>
                </el-col>
            </el-row>
            <el-row>
                <el-col :span="12">
                    <el-form-item label="公司电话" prop="tel"
                                  v-if="!false">
                        <el-input clearable placeholder="请输入公司电话"
                                  v-model="ruleForm.tel"></el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="公司传真" prop="fax"
                                  v-if="!false">
                        <el-input clearable placeholder="请输入公司传真"
                                  v-model="ruleForm.fax"></el-input>
                    </el-form-item>
                </el-col>
            </el-row>
            <el-row>
                <el-col :span="12">
                    <el-form-item label="公司邮箱" prop="email"
                                  v-if="!false">
                        <el-input clearable placeholder="请输入公司邮箱"
                                  v-model="ruleForm.email"></el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="公司地址" prop="address"
                                  v-if="!false">
                        <el-input clearable placeholder="请输入公司地址"
                                  v-model="ruleForm.address"></el-input>
                    </el-form-item>
                </el-col>
            </el-row>

            <el-row>
                <el-col :span="12">
                    <el-form-item label="企业QQ" prop="qq"
                                  v-if="!false">
                        <el-input clearable placeholder="请输入企业QQ"
                                  v-model="ruleForm.qq"></el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="企业微博" prop="weibo"
                                  v-if="!false">
                        <el-input clearable placeholder="请输入企业微博"
                                  v-model="ruleForm.weibo"></el-input>
                    </el-form-item>
                </el-col>
            </el-row>

            <el-row>
                <el-col :span="12">
                    <el-form-item label="状态" prop="statusCode"
                                  v-if="!false">
                        <el-select placeholder="请选择状" v-model="ruleForm.statusCode">
                            <el-option
                                    :key="sitem.value"
                                    :label="sitem.name"
                                    :value="sitem.value"
                                    clearable
                                    v-for="sitem in selectData"
                            >
                            </el-option>
                        </el-select>
                    </el-form-item>

                </el-col>
                <el-col :span="12">
                    <el-form-item label="默认语言" prop="defaultLang"
                                  required v-if="!false">
                        <el-select placeholder="请选择状" v-model="ruleForm.defaultLang">
                            <el-option
                                    :key="sitem.value"
                                    :label="sitem.name"
                                    :value="sitem.value"
                                    clearable
                                    v-for="sitem in langs"
                            >
                            </el-option>
                        </el-select>
                    </el-form-item>
                </el-col>
            </el-row>
            <el-form-item label="版权信息" prop="copyright"
                          required v-if="!false">
                <el-input clearable placeholder="请输入版权信息"
                          v-model="ruleForm.copyright"></el-input>
            </el-form-item>

            <el-form-item label="修改人" prop="updatedBy"
                          v-if="!true">
                <el-input clearable placeholder="请输入修改人"
                          v-model="ruleForm.updatedBy"></el-input>
            </el-form-item>

            <el-form-item label="修改时间" prop="updatedDate"
                          v-if="!true">
                <el-date-picker clearable placeholder="请选择修改时间" type="date"
                                v-model="ruleForm.updatedDate">
                </el-date-picker>
            </el-form-item>

            <el-form-item label="创建人" prop="createdBy"
                          v-if="!true">
                <el-input clearable placeholder="请输入创建人"
                          v-model="ruleForm.createdBy"></el-input>
            </el-form-item>

            <el-form-item label="创建时间" prop="createdDate"
                          v-if="!true">
                <el-date-picker clearable placeholder="请选择创建时间" type="date"
                                v-model="ruleForm.createdDate">
                </el-date-picker>
            </el-form-item>

            <el-form-item label="是否删除 0 否 1 是" prop="isDel"
                          v-if="!true">
                <el-input-number clearable placeholder="请输入是否删除 0 否 1 是"
                                 v-model="ruleForm.isDel"/>
            </el-form-item>

            <el-form-item label="状态" prop="statusName"
                          required v-if="!true">
                <el-input clearable placeholder="请输入状态码名称"
                          v-model="ruleForm.statusName"></el-input>
            </el-form-item>


            <el-form-item>
                <el-row>
                    <el-col :span="2">
                        <el-button @click="merge()" size="small" type="primary">
                            <font-awesome-icon icon="save" style="vertical-align: middle;color:#e3e9f2;"/>
                            <span style="vertical-align: middle;">  提交 </span></el-button>
                    </el-col>
                    <el-col :span="2">
                        <el-button @click="mergeDraft()" size="small" type="primary">
                            <font-awesome-icon icon="save" style="vertical-align: middle;color:#e3e9f2;"/>
                            <span style="vertical-align: middle;">  暂存 </span></el-button>
                    </el-col>
                    <el-col :span="2">
                        <el-button @click="resetForm()" size="small">
                            <font-awesome-icon icon="undo" style="vertical-align: middle;color:#e3e9f2;"/>
                            <span style="vertical-align: middle;">  重置 </span></el-button>
                    </el-col>
                </el-row>
            </el-form-item>
        </el-form>
    </el-dialog>
    <el-dialog :center="false" :close-on-click-modal="false" :close-on-press-escape="false" :lock-scroll="true"
               title="查看数据"
               top="20px" v-model="viewVisible" width="80%">
        <el-form :model="ruleForm" class="view-ruleForm" label-width="15%" ref="ruleForm">
            <el-form-item label="系统配置主键" prop="idSystemconfig" v-show="false">
                <span>{{ruleForm.idSystemconfig}}</span>
            </el-form-item>
            <el-form-item label="系统名称" prop="systemName">
                <span>{{ruleForm.systemName}}</span>
            </el-form-item>
            <el-form-item label="系统关键字" prop="keywords">
                <span>{{ruleForm.keywords}}</span>
            </el-form-item>
            <el-form-item label="系统描述" prop="description">
                <span>{{ruleForm.description}}</span>
            </el-form-item>

            <el-form-item label="公司邮箱" prop="email">
                <span>{{ruleForm.email}}</span>
            </el-form-item>
            <el-form-item label="公司电话" prop="tel">
                <span>{{ruleForm.tel}}</span>
            </el-form-item>
            <el-form-item label="公司传真" prop="fax">
                <span>{{ruleForm.fax}}</span>
            </el-form-item>
            <el-form-item label="公司地址" prop="address">
                <span>{{ruleForm.address}}</span>
            </el-form-item>
            <el-form-item label="是否开启产品评论" prop="isProductFeedback">
                <span>{{dataConvert(ruleForm.isProductFeedback)}}</span>
            </el-form-item>
            <el-form-item label="是否开启新闻页面评论" prop="isNewsFeedback">
                <span>{{dataConvert(ruleForm.isNewsFeedback)}}</span>
            </el-form-item>
            <el-form-item label="是否开启单页面评论" prop="isSingleFeedback">
                <span>{{dataConvert(ruleForm.isSingleFeedback)}}</span>
            </el-form-item>
            <el-form-item label="是否首页静态化" prop="indexHtml">
                <span>{{dataConvert(ruleForm.indexHtml)}}</span>
            </el-form-item>
            <el-form-item label="是否全局静态化" prop="allHtml">
                <span>{{dataConvert(ruleForm.allHtml)}}</span>
            </el-form-item>
            <el-form-item label="缩略图片地址" prop="imageShortcut">
                <span>{{ruleForm.imageShortcut}}</span>
            </el-form-item>
            <el-form-item label="图片地址" prop="imageAddr">
                <span>{{ruleForm.imageAddr}}</span>
            </el-form-item>
            <el-form-item label="版权信息" prop="copyright">
                <span>{{ruleForm.copyright}}</span>
            </el-form-item>
            <el-form-item label="修改人" prop="updatedBy">
                <span>{{ruleForm.updatedBy}}</span>
            </el-form-item>
            <el-form-item label="修改时间" prop="updatedDate">
                <span>{{ruleForm.updatedDate}}</span>
            </el-form-item>
            <el-form-item label="创建人" prop="createdBy">
                <span>{{ruleForm.createdBy}}</span>
            </el-form-item>
            <el-form-item label="创建时间" prop="createdDate">
                <span>{{ruleForm.createdDate}}</span>
            </el-form-item>
            <el-form-item label="是否删除" prop="isDel">
                <span>{{dataConvert(ruleForm.isDel)}}</span>
            </el-form-item>
            <el-form-item label="状态码名称" prop="statusName">
                <span>{{ruleForm.statusName}}</span>
            </el-form-item>
            <el-form-item label="默认语言" prop="defaultLang">
                <span>{{ruleForm.defaultLang}}</span>
            </el-form-item>
            <el-form-item>
                <el-button @click="this.viewVisible=!this.viewVisible" size="small" type="warning">关闭</el-button>
            </el-form-item>
        </el-form>
    </el-dialog>
    <div style="height: 100%">
        <!--查询区域-->
        <div class="content-search">
            <fieldset style="text-align: left;width: 99%;margin: 5px auto;border-color: #e3e9f2;">
                <legend style="font-size: 14px;">查询区域</legend>
                <el-form :inline="true" :model="searchForm" class="el-form--inline">
                    <el-form-item label="所属分类">
                        <el-select placeholder="请选择分类名称" clearable v-model="searchForm.idDataCategory">
                            <el-option
                                    :key="sitem.idMenuinfo"
                                    :label="sitem.menuName"
                                    :value="sitem.idMenuinfo"
                                    v-for="sitem in menusList"
                            >
                            </el-option>
                        </el-select>
                    </el-form-item>
                    <el-form-item label="标题">
                        <el-input placeholder="请输入标题" clearable v-model="searchForm.feedbackTitle"/>
                    </el-form-item>
                    <el-form-item label="状态">
                        <el-select placeholder="请选择状态" clearable v-model="searchForm.statusCode">
                            <el-option
                                    :key="sitem.value"
                                    :label="sitem.name"
                                    :value="sitem.value"
                                    v-for="sitem in selectData"
                            >
                            </el-option>
                        </el-select>
                    </el-form-item>
                    <el-form-item>
                        <el-row>
                            <el-col :span="12">
                                <el-button @click="refresh" type="primary" size="middle">
                                    <font-awesome-icon icon="search" style="vertical-align: middle;color:#e3e9f2;"/>
                                    <span style="vertical-align: middle;"> 查询 </span>
                                </el-button>
                            </el-col>
                            <el-col :span="12">
                                <el-button @click="resetForm" size="middle">
                                    <font-awesome-icon icon="reset" style="vertical-align: middle;color:#999999;"/>
                                    <span style="vertical-align: middle;"> 重置 </span>
                                </el-button>
                            </el-col>
                        </el-row>
                    </el-form-item>
                </el-form>
            </fieldset>
        </div>
        <table class="inner_button">
            <tr>
                <td v-if="permission.add">
                    <el-button @click="btnOperation(1)" size="small" type="primary">
                        <font-awesome-icon icon="plus" style="vertical-align: middle;color:#e3e9f2;"/>
                        <span style="vertical-align: middle;"> 新增 </span>
                    </el-button>
                </td>
                <td v-if="permission.batchAdd">
                    <el-button @click="btnOperation(11)" size="small" type="primary">
                        <font-awesome-icon icon="plus-square" style="vertical-align: middle;color:#e3e9f2;"/>
                        <span style="vertical-align: middle;"> 批量新增 </span>
                    </el-button>
                </td>
                <td v-if="permission.edit">
                    <el-button @click="btnOperation(2)" size="small" type="primary">
                        <font-awesome-icon icon="edit" style="vertical-align: middle;color:#e3e9f2;"/>
                        <span style="vertical-align: middle;">  编辑 </span>
                    </el-button>
                </td>
                <td v-if="permission.view">
                    <el-button @click="btnOperation(3)" size="small" type="primary">
                        <font-awesome-icon icon="book-open" style="vertical-align: middle;color:#e3e9f2;"/>
                        <span style="vertical-align: middle;">  查看 </span>
                    </el-button>
                </td>
                <td v-if="permission.delete">
                    <el-button @click="btnOperation(4)" size="small" type="danger">
                        <font-awesome-icon icon="minus-square" style="vertical-align: middle;color:#e3e9f2;"/>
                        <span style="vertical-align: middle;">  删除 </span>
                    </el-button>
                </td>
                <td v-if="permission.view">
                    <el-button @click="btnOperation(5)" size="small" type="primary">
                        <font-awesome-icon icon="sync" style="vertical-align: middle;color:#e3e9f2;"/>
                        <span style="vertical-align: middle;">  刷新 </span>
                    </el-button>
                </td>
                <td v-if="permission.download">
                    <el-button @click="btnOperation(6)" size="small" type="primary">
                        <font-awesome-icon icon="file-download" style="vertical-align: middle;color:#e3e9f2;"/>
                        <span style="vertical-align: middle;">  下载模板 </span>
                    </el-button>
                </td>
                <td v-if="permission.execution">
                    <el-button @click="btnOperation(7)" size="small" type="primary">
                        <font-awesome-icon icon="play-circle" style="vertical-align: middle;color:#e3e9f2;"/>
                        <span style="vertical-align: middle;">  数据库&静态化 </span>
                    </el-button>
                </td>
                <td v-if="permission.upload">
                    <el-upload
                            :auto-upload="true"
                            :on-change="upload"
                            :on-error="uploadError"
                            :on-progress="uploadProcess"
                            :on-success="uploadSuccess"
                            :show-file-list="false"
                            action="/lee-cms/cms/systemconfigEntity/importData"
                            class="upload-demo"
                            name="file"
                    >
                        <el-button size="small" type="primary">
                            <font-awesome-icon icon="file-upload" style="vertical-align: middle;color:#e3e9f2;"/>
                            <span style="vertical-align: middle;">  上传 </span></el-button>
                    </el-upload>
                </td>
                <td v-if="permission.export">
                    <el-button @click="btnOperation(8)" size="small" type="primary">
                        <font-awesome-icon icon="file-export" style="vertical-align: middle;color:#e3e9f2;"/>
                        <span style="vertical-align: middle;">  导出 </span>
                    </el-button>
                </td>
            </tr>
        </table>

        <el-table
                :data="dataList"
                :row-key="getRowIdentity"
                @row-dblclick="editData"
                @selection-change="handleSelectionChange"
                border
                fit="true"
                highlight-current-row="true"
                id="systemconfigPo"
                ref="multipleTable"
                stripe="true"
                style="width: 100%;height:61%">
            <el-table-column fixed width="1"/>
            <el-table-column
                    :reserve-selection="true"
                    align="center"
                    type="selection"
            />
            <el-table-column
                    :formatter="dataFormat"
                    :show-overflow-tooltip="true"
                    label="系统配置主键"
                    prop="idSystemconfig"
                    v-if=" false ">
            </el-table-column>
            <el-table-column
                    :formatter="dataFormat"
                    :show-overflow-tooltip="true"
                    label="系统名称"
                    prop="systemName"
                    v-if="true ">
            </el-table-column>
            <el-table-column
                    :formatter="dataFormat"
                    :show-overflow-tooltip="true"
                    label="默认显示"
                    prop="isDefaultShow"
                    v-if="true ">
            </el-table-column>
            <el-table-column
                    :formatter="dataFormat"
                    :show-overflow-tooltip="true"
                    label="是否开启产品评论"
                    prop="isProductFeedback"
                    v-if="true ">
            </el-table-column>
            <el-table-column
                    :formatter="dataFormat"
                    :show-overflow-tooltip="true"
                    label="是否开启新闻页面评论"
                    prop="isNewsFeedback"
                    v-if="true ">
            </el-table-column>
            <el-table-column
                    :formatter="dataFormat"
                    :show-overflow-tooltip="true"
                    label="是否开启单页面评论"
                    prop="isSingleFeedback"
                    v-if="true ">
            </el-table-column>
            <el-table-column
                    :formatter="dataFormat"
                    :show-overflow-tooltip="true"
                    label="系统关键字"
                    prop="keywords"
                    v-if="true ">
            </el-table-column>
            <el-table-column
                    :formatter="dataFormat"
                    :show-overflow-tooltip="true"
                    label="系统描述"
                    prop="description"
                    v-if="true ">
            </el-table-column>
            <el-table-column
                    :formatter="dataFormat"
                    :show-overflow-tooltip="true"
                    label="缩略图片地址"
                    prop="imageShortcut"
                    v-if="true ">
            </el-table-column>
            <el-table-column
                    :formatter="dataFormat"
                    :show-overflow-tooltip="true"
                    label="图片地址"
                    prop="imageAddr"
                    v-if="true ">
            </el-table-column>
            <el-table-column
                    :formatter="dataFormat"
                    :show-overflow-tooltip="true"
                    label="版权信息"
                    prop="copyright"
                    v-if="true ">
            </el-table-column>
            <el-table-column
                    :formatter="dataFormat"
                    :show-overflow-tooltip="true"
                    label="修改人"
                    prop="updatedBy"
                    v-if=" false ">
            </el-table-column>
            <el-table-column
                    :formatter="dataFormat"
                    :show-overflow-tooltip="true"
                    label="修改时间"
                    prop="updatedDate"
                    v-if=" false ">
            </el-table-column>
            <el-table-column
                    :formatter="dataFormat"
                    :show-overflow-tooltip="true"
                    label="创建人"
                    prop="createdBy"
                    v-if=" false ">
            </el-table-column>
            <el-table-column
                    :formatter="dataFormat"
                    :show-overflow-tooltip="true"
                    label="创建时间"
                    prop="createdDate"
                    v-if=" false ">
            </el-table-column>
            <el-table-column
                    :formatter="dataFormat"
                    :show-overflow-tooltip="true"
                    label="是否删除 0 否 1 是"
                    prop="isDel"
                    v-if=" false ">
            </el-table-column>
            <el-table-column
                    :formatter="dataFormat"
                    :show-overflow-tooltip="true"
                    label="状态码名称"
                    prop="statusName"
                    v-if="true ">
            </el-table-column>
            <el-table-column
                    :formatter="dataFormat"
                    :show-overflow-tooltip="true"
                    label="状态码"
                    prop="statusCode"
                    v-if=" false ">
            </el-table-column>
            <el-table-column
                    :formatter="dataFormat"
                    :show-overflow-tooltip="true"
                    label="默认语言 默认中文"
                    prop="defaultLang"
                    v-if="true ">
            </el-table-column>
        </el-table>
        <el-pagination
                :current-page="currentPage"
                :page-count="totalPage"
                :page-size="pageSize"
                :page-sizes="[20,50, 100, 150, 200]"
                :total="totalData"
                @current-change="pageChangeClick"
                @next-click="pageClick(2)"
                @prev-click="pageClick(1)"
                @size-change="pageSizeClick"
                current-page="当前页"
                jumper-text="跳转"
                layout="total, sizes, prev, pager, next, jumper"
                next-text="下一页"
                prev-text="上一页">
        </el-pagination>
    </div>
</template>
<style>
</style>
<script>
    import {ElLoading} from "element-plus"
    import CmsEditor from "../config/Editor";
    import {getToken} from "../../utils/auth";
    import {confirm, error, success, warning} from "../../utils/message";
    import {download, getRequest, loadStatus, permissionResources, postRequest} from "../../api/star_horse";

    export default {
        name: "SystemconfigEntity",
        components: {CmsEditor},
        setup() {
            return {}
        },
        data() {
            return {
                loading: null,
                batchDialogTitle: "",
                batchDialogTableVisible: false,
                dialogTableVisible: false,
                uploadVisible: false,
                viewVisible: false,
                dialogDbVisible: false,
                dialogTitle: "",
                token: getToken(),
                ruleForm: {},
                searchForm: {},
                dbForm: {type: "1"},
                description:"",
                dataList: [],
                permission: {
                    view: "view",
                    add: "add",
                    edit: "edit",
                    execution: "execution",
                    // export: "export",
                    // upload: "upload",
                    // download: "download",
                    delete: "delete"
                },
                idAttachment: 0,
                checkedDetail: [],
                batchDataList: [],
                multipleSelection: [],
                dbSelection: [],
                selectData: [],
                dbFileList: [],
                langs: [{name: "中文", value: "zh_CN"}, {name: "英文", value: "en_Ch"}],
                dbTypes: [{name: "所有", value: "1"}, {name: "表结构", value: "2"}, {name: "数据", value: "3"}],
                htmlTypes: [{name: "首页静态化", value: "1"}, {name: "全站静态化", value: "2"}],
                currentPage: 1,
                pageSize: 20,
                totalPage: 0,
                totalData: 0,
                socket: null,
                rules: {}
            }
        },

        methods: {
            input(v){
                this.ruleForm.description=v;
               // console.log(this.ruleForm.description);
            },
            initWebSocket() {
                this.socket = new WebSocket("ws://127.0.0.1:63342");
                this.socket.onopen = function (env) {
                    console.log(env);
                };
                this.socket.onclose = function (env) {
                    console.log(env);
                };
                this.socket.onmessage = function (env) {
                    console.log(env);
                };
                this.socket.onerror = function (env) {
                    console.log(env);
                }
            },
            closeWebSocket() {
                console.log("关闭websock");
                if (this.socket) {
                    this.socket.close();
                    this.socket = null;
                }
            },
            /**
             * 数据显示转换
             */
            dataConvert(data) {
                return data == 1 ? "是" : "否";
            },
            rowClassName({row, rowIndex}) {
                row.xh = rowIndex + 1;
            },
            //单选框选中数据
            handleDetailSelectionChange(selection) {
                if (selection.length > 1) {
                    this.$refs.tb.clearSelection();
                    this.$refs.tb.toggleRowSelection(selection.pop());
                } else {
                    this.checkedDetail = selection;
                }
            },
            handleAddDetails() {
                if (this.batchDataList == undefined) {
                    this.batchDataList = new Array();
                }
                let obj = {};

                this.batchDataList.push(obj);
            },
            handleDeleteDetails() {
                if (this.checkedDetail.length == 0) {
                    warning("请先选择要删除的数据");
                } else {
                    this.batchDataList.splice(this.checkedDetail[0].xh - 1, 1);
                }
            },
            handleDeleteAllDetails() {
                this.batchDataList = [];
            },
            convertCate(catId) {
                let cadata = this.menusList.find(s => s.idMenusinfo === catId);
                return !cadata ? "--" : cadata["menuName"]
            },
            dataFormat(row, column, cellValue, index) {
                if (!cellValue) {
                    return "-";
                }
                if (column.property == "idDataCategory") {
                    return this.convertCate(cellValue);
                }
                if (column.property == "createdDate" || column.property == "updatedDate") {
                    let date = new Date(cellValue);
                    return date.getFullYear() + "-" + (date.getMonth() + 1) + "-"
                        + date.getDate() + " " + date.getHours() + ":" + date.getMinutes() + ":" + date.getSeconds();
                } else {
                    return cellValue == 1 ? "是" : cellValue == 0 ? "否" : cellValue;
                }
            },
            /**
             * 加载框
             */
            load(msg) {
                if (!this.loading) {
                    this.loading = ElLoading.service({
                        lock: true,
                        target: "#systemconfigPo",
                        text: msg || 'Loading',
                        background: 'rgba(0, 0, 0, 0.7)',
                    });
                } else {
                    this.loading.open();
                }
            }
            ,
            closeLoad() {
                if (this.loading) {
                    this.loading.close();
                    this.loading = null;
                }
            }
            ,
            getDbIdentity(row) {
                return row["idAttachment"];
            },
            getRowIdentity(row) {
                return row[this.getIdName()];
            }
            ,
            getIdName() {
                return "idSystemconfig";
            },
            backup() {


                this.restore(null);
            },
            restore(type) {
                let action = "backup";
                if (type) {
                    action = "restore";
                    if (this.dbSelection.length === 0) {
                        warning("请选择要还原的文件");
                        return;
                    }
                    this.dbForm["fileName"] = this.dbSelection["fileName"];
                }
                getRequest("/admin/information.php?action=" + action + "&type=" +
                    this.dbForm["type"] + "&fileName=" + this.dbForm["fileName"]
                ).then(res => {
                    success(res.data.cnMessage);
                    this.idAttachment = 0;
                    this.loadDbFile();
                });
            },
            htmlOper(type) {

                getRequest("/admin/information.php?action=html&type=" + type
                ).then(res => {
                    this.initWebSocket();
                    success(res.data.cnMessage);
                });
            },
            /**
             * 按钮操作
             */
            btnOperation(type) {
                this.closeLoad();
                switch (type) {
                    //新增编辑
                    case 1:
                        this.ruleForm = {
                            shortcutWidth: 200,
                            shortcutHeight: 300,
                            imageWidth: 400,
                            imageHeight: 600
                        };
                        this.dialogTableVisible = !this.dialogTableVisible;
                        this.dialogTitle = "新增数据";
                        break;
                    case 11:
                        this.batchDataList = [];
                        this.batchDialogTableVisible = !this.batchDialogTableVisible;
                        this.batchDialogTitle = "批量新增";
                        break;
                    case 2:
                        this.ruleForm = {};
                        if (this.multipleSelection.length < 1) {
                            warning("至少需要选择一条要编辑的数据");
                            return;
                        }
                        this.dialogTableVisible = !this.dialogTableVisible;
                        this.dialogTitle = "编辑数据";
                        this.loadById(this.multipleSelection[0][this.getIdName()]);
                        // this.$refs.multipleTable.clearSelection();
                        break;
                    //查看
                    case 3:
                        if (this.multipleSelection.length != 1) {
                            warning("查看数据只能选择一条");
                            return;
                        }
                        this.viewVisible = true;
                        this.loadById(this.multipleSelection[0][this.getIdName()]);
                        break;
                    //删除
                    case 4:
                        this.delete()
                        break;
                    //刷新
                    case 5:
                        this.loadByPage(1, this.pageSize);
                        break;
                    //下载模板
                    case 6:
                        this.downloadTemplate();
                        break;
                    case 7:
                        if (this.multipleSelection.length < 1) {
                            warning("请选择数据");
                            return;
                        }
                        this.loadById(this.multipleSelection[0][this.getIdName()]);
                        this.dialogDbVisible = !this.dialogDbVisible;
                        this.idAttachment = 0;
                        this.loadDbFile();

                        break;
                    //导出
                    case 8:
                        this.exportAll();
                        break;
                    default:
                        throw error("未知类型");
                }
            },
            loadDbFile() {
                postRequest("/admin/information.php?action=loaddb", {}).then(res => {
                    let data = res.data.data;
                    this.dbFileList = data;
                })
            }
            ,
            pageClick(type) {
                this.loadByPage(this.currentPage, this.pageSize);
            }
            ,
            pageSizeClick(pageSize) {
                this.pageSize = pageSize;
                this.loadByPage(this.currentPage, pageSize);
            }
            ,
            pageChangeClick(currentPage) {
                this.currentPage = currentPage;
                this.loadByPage(this.currentPage, this.pageSize);
            }
            ,
            editData(row, column, event) {
                this.viewVisible = !this.viewVisible;
                this.loadById(row[this.getIdName()]);
            }
            ,
            //重置数据
            resetForm() {
                this.ruleForm = {};
                this.searchForm = {};
                this.batchDataList = [];
            }
            ,
            //处理选中的数据
            handleSelectionChange(val) {
                this.multipleSelection = val;
            }
            ,
            dbSelectionChange(val) {
                this.dbSelection = val;
            },
            /**
             * 初始化数据
             */
            init: async function () {
                this.dataList = [];
                this.selectData = [];
                this.loadByPage(this.currentPage, this.pageSize);
                // this.loadPermissionResources();
                // this.loadSelectData();
                this.selectData = await loadStatus("lee_system_config");
            },
            /**
             * 加载资源权限
             */
            loadPermissionResources() {
                let that = this;
                let meta = that.$router.currentRoute.value.meta;
                let data = {"menuId": meta.menuId};
                permissionResources(data).then(res => {
                    let redata = res.data.data;
                    redata.forEach(item => {
                        that.permission[item.resCode] = item.resCode;
                    });
                });
            },
            /**
             * 状态码数据
             */
            loadSelectData() {
                let that = this;
                let query = [];
                postRequest("/admin/information.php?action=status", {
                    "statusType": "lee_systemconfig"
                }).then(res => {
                    let redata = res.data;
                    that.selectData = redata.data;
                }).catch(err => {
                    error(err);
                });
            }
            ,
            /**
             * 分页显示数据
             */
            loadByPage: function (currentPage, pageSize) {
                let that = this;
                this.load();
                let queryData = that.searchForm;
                queryData["currentPage"] = currentPage < 1 ? 1 : currentPage;
                queryData["pageSize"] = pageSize || that.pageSize;
                postRequest("/admin/information.php?action=page", queryData).then(res => {
                    let redata = res.data.data;
                    that.dataList = redata.dataList;
                    that.totalPage = redata.totalPages;
                    that.currentPage = redata.currentPage;
                    that.totalData = redata.totalDatas;
                }).catch(err => {
                    error(err);
                }).finally(() => {
                    that.closeLoad();
                })
            }
            ,
            /**
             * 刷新数据
             */
            refresh: function () {
                this.init();
            }
            ,
            /**
             * 编辑保存数据
             */
            merge: function () {
                let flag = false;
                let that = this;
                that.$refs.ruleForm.validate((valid) => {
                    flag = valid;
                });
                if (!flag) {
                    return;
                }
                that.load();
                let statusCode = that.ruleForm.statusCode;
                that.ruleForm.statusName = that.getStatusName(statusCode);
                postRequest("/admin/information.php?action=merge", that.ruleForm).then(res => {
                    success(res.data.cnMessage);
                    that.closeLoad();
                    that.loadByPage(1, that.pageSize);
                    that.ruleForm = {};
                    that.dialogTableVisible = !that.dialogTableVisible;
                }).catch(err => {
                    error(err);
                }).finally(() => {
                    that.closeLoad();
                })
            }
            , getStatusName(statusCode) {
                let that = this;
                if (statusCode && that.selectData && that.selectData.length > 0) {
                    let sData = that.selectData.find(item => item.value === statusCode);
                    return !sData ? "" : sData.name;
                }
                return "";
            },
            /**
             * 编辑保存数据
             */
            mergeDraft: function () {
                let that = this;
                this.load();
                let statusCode = that.ruleForm.statusCode;
                that.ruleForm.statusName = that.getStatusName(statusCode);
                postRequest("/admin/information.php?action=merge", that.ruleForm).then(res => {
                    success(res.data.cnMessage);
                    that.closeLoad();
                    that.loadByPage(1, this.pageSize);
                    that.ruleForm = {};
                    that.dialogTableVisible = !that.dialogTableVisible;
                }).catch(err => {
                    error(err);
                }).finally(() => {
                    that.closeLoad();
                })
            }

            ,
            /**
             * 获取已选中数据的Id
             */
            getSelectedData() {
                let ids = [];
                this.multipleSelection.forEach(item => ids.push(item[this.getIdName()]));
                return ids.toString();
            }
            ,
            /**
             * 加载指定数据
             */
            loadById: function (id) {
                let that = this;
                that.load();
                getRequest("/admin/information.php?action=load_id&id=" + id).then(res => {
                    that.ruleForm = res.data.data;
                    that.ruleForm["webchatList"] = !that.ruleForm["webchat"] ? [] : [{
                        name: "WebChat",
                        url: that.ruleForm["webchat"]
                    }];
                    that.description=that.ruleForm.description;
                    that.ruleForm["logoList"] = !that.ruleForm["logo"] ? [] : [{
                        name: "logo",
                        url: that.ruleForm["logo"]
                    }];
                }).catch(err => {
                    error(err);
                }).finally(() => {
                    that.closeLoad();
                })
            }
            ,
            /**
             * 删除数据
             */
            delete: function () {
                let that = this;
                if (!this.multipleSelection || this.multipleSelection.length == 0) {
                    warning("请选择要删除的数据");
                    return;
                }
                this.load();
                confirm("确认需要删除选择的数据吗？", function () {
                    postRequest("/admin/information.php?action=delete", {"ids": that.getSelectedData()}).then(res => {
                        success(res.data.cnMessage);
                        that.multipleSelection = [];
                        that.closeLoad();
                        that.loadByPage(that.currentPage, that.pageSize);
                    }).catch(err => {
                        error(err)
                    }).finally(() => {
                        that.closeLoad();
                    })
                })

            }
            ,

            webchatAction: function (action) {
                return "/admin/information.php?action=" + action + "&token=" + getToken();
            },
            /**
             * 上传数据
             */
            upload: function (file, fileList) {

            }
            ,
            /**
             * 上传过程
             */
            uploadProcess: function (event, file, fileList) {
                this.load("数据导入中,请等待");
            }
            ,
            /**
             * 上传失败
             */
            uploadError: function (error, file, fileList) {
                this.closeLoad();
            }
            ,
            /**
             * 上传成功
             */
            uploadSuccess: function (response, file, fileList) {
                success(response.cnMessage);
                let data = response.data;
                console.log(data);
                // this.ruleForm[]
                this.ruleForm[data["action"]] = data["path"];
                this.closeLoad();
                // this.init();
            }
            ,
            removeFile: function (file) {
                if (file.name == "WebChat") {
                    this.ruleForm["webchat"] = "";
                    this.ruleForm["webchatList"] = [];
                }
                if (file.name == "logo") {
                    this.ruleForm["logo"] = "";
                    this.ruleForm["logoList"] = [];
                }

            },
            /**
             * 导出所有数据
             */
            exportAll: function () {
                let that = this;
                that.load();
                download("/admin/information.php?action=export_all", that.getSelectedData()).catch(err => {
                    error(err);
                }).finally(() => {
                    that.closeLoad();
                })
            }
            ,
            /**
             * 下载模板
             */
            downloadTemplate: function () {
                let that = this;
                download("/admin/information.php?action=template", {}).catch(error => {
                    that.error(error);
                });
            }
        },
        created() {
            this.init();

        }
    }
</script>